import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [{
  path: '/login',
  name: 'login',
  component: () => import('@/views/login/index.vue')
},
{
  path: '/',
  // 如果父路由有默认的子路由，那他的那么就没有意义，可以省略
  // name: 'layout',
  component: () => import('@/views/layout/index.vue'),
  children: [
    {
      // 默认子路由，只能有一个，当访问'/'的时候，显示home组件
      path: '',
      name: 'home',
      component: () => import('@/views/home/index.vue')
    },
    {
      path: '/qa',
      name: 'qa',
      component: () => import('@/views/qa/index.vue')
    },
    {
      path: '/video',
      name: 'video',
      component: () => import('@/views/video/index.vue')
    },
    {
      path: '/my',
      name: 'my',
      component: () => import('@/views/my/index.vue')
    }
  ]
},
{
  path: '/search',
  name: 'search',
  component: () => import('@/views/search/index.vue')
},
// 文章详情页路由
{
  path: '/article/:articleId',
  name: 'article',
  component: () => import('@/views/article/index.vue'),
  // 将路由动态参数映射到组件的props中，更推荐这种做法
  props: true
},
// 编辑资料页面
{
  path: '/user/profile',
  name: 'user-profile',
  component: () => import('@/views/user-profile/index.vue')

}

]

const router = new VueRouter({
  routes
})

export default router
